<!--
+----------------------------------------------------------------------
| 友得云客  - 开启房产营销新纪元
+----------------------------------------------------------------------
| Copyright (c) 2019~2023 优得（西安）信息科技有限公司版权所有
+----------------------------------------------------------------------
| Licensed 友得云客不是自由软件 未经允许不可移除相关版权
+----------------------------------------------------------------------
| Author: www.youdeyunke.com
+----------------------------------------------------------------------
-->
<template>
    <div class="follow-editor" v-if="module" v-cloak>
        <el-tabs :stretch="true" v-model="activeTab">
            <el-tab-pane label="基础" name="base">
                <el-form label-position="top">
                    <el-form-item label="提示文字">
                        <el-input style="width: 250px" size="mini" type="textarea" :rows="5" v-model="module.data.message"
                            placeholder="请输入"></el-input>
                        <div>找房信息提交成功后的提示文字</div>
                    </el-form-item>
                </el-form>
            </el-tab-pane>

            <el-tab-pane label="标题" name="header">
                <header-editor :module="module.header" v-if="module.header"></header-editor>
            </el-tab-pane>

            <el-tab-pane label="样式" name="style">
                <module-style-editor :module="module"></module-style-editor>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>

<script>
import FontEditor from "./base/FontEditor";
import LinkEditor from "@/components/LinkEditor";
import ModuleStyleEditor from "./ModuleStyleEditor/Index";
import VueInputTag from "vue-input-tag";
import ImagePicker from "@/components/ImagePicker";
import HeaderEditor from "./base/HeaderEditor";

export default {
    components: {
        FontEditor,
        LinkEditor,
        HeaderEditor,
        ModuleStyleEditor,
        VueInputTag,
        ImagePicker,
    },
    data () {
        return {
            predefineColors: ["#f9f9f9", "#f4f4f4", "#cecece"],
            activeTab: "base",
            loading: false,
            tagValue: "",
            // 标题的样式
            styleItems: [
                { name: "1", value: "normal" },
                { name: "2", value: "round" },
            ],
        };
    },

    watch: {},

    computed: {
        module: function () {
            return this.$store.state.pagemaker.currentModule;
        },
    },
    methods: {
        styleChangeHandle: function (val) {
            this.$set(this.module, "styleName", val);
        },
    },
};
</script>

<style scoped>
.inline {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
</style>
